import React from 'react';
// import { DropdownButton, MenuItem } from 'react-bootstrap';
import weAjax from '../utils/ajax';



class ServiceCreation extends React.Component {
    constructor(props) {
        super(props);
        this.handleChange1 = this.handleChange1.bind(this);
        this.handleChange2 = this.handleChange2.bind(this);
        this.handleChange3 = this.handleChange3.bind(this);

        this.onSubmit = this.onSubmit.bind(this);
        this.state = {
            service_name: '',
            secretkey: '',
            appid: ''
        };
    }

    create() {
        weAjax({ url: this.props.api, method: 'post' }, {
            name: this.state.service_name,
            secretkey: this.state.secretkey,
            appid: this.state.appid
        }, (data) => {
            if (data.affectedRows >= 1) {
                alert('创建成功！');
                this.setState({ service_name: '', secretkey: '', appid: '' });
            }
        })
    }

    onSubmit(e) {
        e.preventDefault();
        this.create();
    }

    handleChange1(e) {
        this.setState({ service_name: e.target.value });
    }

    handleChange2(e) {
        this.setState({ secretkey: e.target.value });
    }

    handleChange3(e) {
        this.setState({ appid: e.target.value });
    }

    render() {
        const service_name = this.state.service_name;
        const secretkey = this.state.secretkey;
        const appid = this.state.appid;

        return (
            <div className="form-form" >
                <div className="form-title">{this.props.name}</div>
                <input className="form-input" value={service_name} onChange={this.handleChange1} placeholder="服务号名称" />
                <input className="form-input" value={secretkey} onChange={this.handleChange2} placeholder="微信秘钥" />
                <input className="form-input" value={appid} onChange={this.handleChange3} placeholder="AppID" />

                <button onClick={this.onSubmit} className='form-button'>创 建</button>
            </div>
        );
    }
}

export default ServiceCreation;